<!-- 
      index.html
      首页 id = index2
      
      Created by tang on 2017-03-07.
      Copyright 2017 tang. All rights reserved.
 -->

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title></title>
    <script src="../js/mui.js"></script>
    <link href="../css/mui.min.css" rel="stylesheet"/>
    <link rel="stylesheet" href="../css/style.css" />
</head>
<body class="white">
	<header id="header" class="mui-bar  mui-index-bar" style="background: transparent;">
	    <!--<a class="mui-icon mui-pull-right link" _href="message.html" _id="message" _extras="" _title="消息列表" ><span class="bexta-icon-xiaoxi"></span></a>-->
	    <!--<a class="mui-icon mui-pull-left link" _id="location" _title="选择城市" _href="location.html" _aniShow="slide-in-top" >深圳 <span class="bexta-icon-dingwei"></span></a>-->
	    <h1 class="mui-title"><div>
	    		<img src="../icon/search-whit@2x.png" alt="" />
	    		<span>Search</span>
	    </div></h1>
	</header>
	<div class="mui-content" id="vueMain">
		<div class="index-banner">
			<img :src="ad.photo" class="maximg" />
		</div>
		<div class="bexta-classify">
			<div class="mui-row ">
				<template v-for="(item,index) in classes">
					<div class="mui-col-sm-12 mui-col-xs-12 link" v-if="index==0" _id="search" :_title="item.name" _href="search.html" :_extras="'type='+item.id">
						<img :src="item.photo" alt="" />
						<div class="md"><span>{{item.name}}</span></div>
					</div>
					<div class="mui-col-sm-12 mui-col-xs-12 link" v-if="index==1" _id="search" :_title="item.name" _href="search.html" :_extras="'type='+item.id"> 
						<img :src="item.photo" alt="" />
						<div class="md"><span>{{item.name}}</span></div>
					</div>
					<div class="mui-col-sm-12 mui-col-xs-12 link" v-if="index==2" _id="list"  _href="list.html" :_extras="'type='+item.id">
						<img :src="item.photo" alt="" />
						<div class="md"><span>{{item.name}}</span></div>
					</div>
					<div class="mui-col-sm-12 mui-col-xs-12 link" v-if="index==3" _id="search" :_title="item.name" _href="search.html" :_extras="'type='+item.id">
						<img :src="item.photo" alt="" />
						<div class="md"><span>{{item.name}}</span></div>
					</div>
				</template>  
			</div>
		</div>
	</div> 
<script src="../js/vue.min.js"></script>
<script src="../js/bexta.js"></script>
<script type="text/javascript">
	var apps;
	mui.plusReady(function () {
		setTimeout(function(){
			bexta.ajax(api.site, function(res){
		   		initVue(res);
		   },{});
		}, 200);
	   
	});
	function initVue(res){
		apps = new Vue({
			el:"#vueMain",
			data:res,
			mounted:function(){
				mui.init();
				setTimeout(function(){
					document.querySelector('.mui-row').classList.add('run'); 
				});

			}
		});
	}
	
	
	
	
	
	
	
//	window.addEventListener('toggleBarBackground', function(){
//		plus.navigator.setStatusBarBackground("#19181e");
//	});
//	document.getElementById('header').style.paddingTop = bexta.getStatusHeight() + 'px';
//	
//	mui.plusReady(function () {
//		setTimeout(function(){
 
//		},200);
//	});
	
//	var vm = new Vue({
//		el:'#vueMain',
//		data:{
//			msg:null
//		},
//		mounted:function(){
//			var self = this;
//			bexta.ajax(api.url + api.site, function(res){
//				self.msg = res;
//			},{});
//		}
//	});
	
	
	
</script>
</body>
</html>
